import 'dart:io';

import 'package:flutter/material.dart';
import 'package:flutter_spinkit/flutter_spinkit.dart';
import 'package:sonora/utils/sj_record_util.dart';

class SjBottomRecorder extends StatefulWidget {
  const SjBottomRecorder({super.key, required this.callback, required this.sendVoice});

  final Function(String path, int duration) callback;

  final Function() sendVoice;

  @override
  State<SjBottomRecorder> createState() => _SjBottomRecorderState();
}

class _SjBottomRecorderState extends State<SjBottomRecorder> {
  bool recording = false;

  bool canDelete = false;
  String? currentRecordPath;

  void start() {
    if(recording){
      return;
    }
    recording = true;
    SjRecordUtil().startRecord();
  }

  void stop() {
    recording = false;
    SjRecordUtil().stopRecord(
      (path, duration) {
        currentRecordPath = path;
        print('send voice msg  $path  $duration');
        widget.callback(path, duration);
        canDelete = true;
        setState(() {

        });
      },
    );
  }

  void cancel() {
    recording = false;
    SjRecordUtil().stopRecord((path, duration) {
      print('cancel voice msg  $path  $duration');
    });
  }

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: (){
        print('onTap');
      },
      child: Container(
        width: double.infinity,
        alignment: Alignment.center,
        color: Colors.white,
        child: Stack(
          children: [
            GestureDetector(
              onTap: () {
                print('onTap');
                if(canDelete) {
                  widget.sendVoice();
                }
              },
              // onPanUpdate: _onPanUpdate,
              onPanDown: _onPanDown,
              onPanCancel: _onPanEnd,
              onPanEnd: _onPanEnd,
              child: Container(
                margin: const EdgeInsets.only(top: 60, bottom: 50),
                width: 100,
                child: Stack(alignment: Alignment.center, children: [
                  if(canDelete)
                    Image.asset('assets/images/voice_record_finish.png')
                  else
                    Image.asset('assets/images/voice_record.png'),
                  if (recording)
                    Container(
                      child: SpinKitRipple(
                        size: 100,
                        itemBuilder: (context, index) {
                          return Container(
                            decoration: const BoxDecoration(
                              shape: BoxShape.circle,
                              color: Colors.red,
                            ),
                          );
                        },
                      ),
                    ),
                ]),
              ),
            ),
            Positioned(
              bottom: 10,
              left: 0,
              right: 0,
              child: Visibility(
                visible: canDelete,
                child: GestureDetector(
                  onTap: () {
                    canDelete = false;
                    if (currentRecordPath != null) {
                      File file = File(currentRecordPath!);
                      if (file.existsSync()) {
                        file.deleteSync();
                      }
                    }
                    setState(() {});
                  },
                  child: Container(
                    width: 24,
                    height: 24,
                    padding: EdgeInsets.all(2),
                    decoration: const BoxDecoration(
                      shape: BoxShape.circle,
                      color: Colors.orangeAccent,
                    ),
                    child: Center(
                      child: Image.asset(
                        'assets/images/voice_cancel.png',
                        width: 16,
                        height: 16,
                      ),
                    ),
                  ),
                ),
              ),
            )
          ],
        ),
      ),
    );
  }

  void _onPanDown(DragDownDetails detail) {
    print('>>>>>_onPanDown');
    start();
    setState(() {});
  }

  void _onPanEnd([DragEndDetails? details]) {
    print('>>>>>_onPanEnd');
    stop();
    setState(() {});
  }
}
